﻿var ProductDetails = function(rHd){
    var __hd = (typeof(rHd)=="string")?rHd:"productDetails";
    var __template = null;
    var __templateKey = null;
    var __data = null;
    var __box = null;
    var __picId = jskitUtil.guid();
    var __ajax = null;
    
    var __showLoading = function(){
        __box.innerHTML = '<div style="	background-image:url(/cellula_client/Controls/images/loading.gif);background-position:center center;background-repeat:no-repeat;width:40px;height:40px;overflow:hidden;">&nbsp;</div>';   
    };
    var __loadTemplate = function(){
        __ajax = new JskitXmlHttpAction("Ws/_Template.aspx?id="+__templateKey+"&rm="+jskitUtil.guid(),__hd+".__loadTemplateCallback","text");
        __showLoading();
    }
    
    this.__loadTemplateCallback = function(tlContent){
        __ajax = null;
        __box.innerHTML = "";
        __template = tlContent;
        __box.innerHTML = __buildContent();
    };
    
    var __decodeHtml = function(rStr){
        rStr = rStr.replace(/&lt;/gi,"<");
        rStr = rStr.replace(/&gt;/gi,">");
        return rStr;
    };
    var __selectedNail = null;
    var __buildContent = function(){
        var _str = __template;
        if(__data.EO==null){
            return "nothing find!";
        }
        window.title = __data.EO.ProductName;
        _str = _str.replace(/\$ProductName/gi,__data.EO.ProductName);
        _str = _str.replace(/\$ProductNo/gi,__data.EO.ProductNo);
        _str = _str.replace(/\$Thumbnail/gi,__data.EO.Thumbnail);
        _str = _str.replace(/\$Length/gi,__data.EO.Length);
        _str = _str.replace(/\$Width/gi,__data.EO.Width);
        _str = _str.replace(/\$Height/gi,__data.EO.Height);
        _str = _str.replace(/\$Color/gi,__data.EO.Color);
        _str = _str.replace(/\$ProducingArea/gi,__data.EO.ProducingAreaName);
        _str = _str.replace(/\$Description/gi,__decodeHtml(__data.EO.Description));
        _str = _str.replace(/\$ProductModel/gi,__data.EO.ProductModel);
        _str = _str.replace(/\$Manufacturer/gi,__data.EO.Manufacturer);
        _str = _str.replace(/\$Material/gi,__data.EO.Material);
        _str = _str.replace(/\$CategoryName/gi,__data.EO.CategoryName);
        _str = _str.replace(/\$CategoryId/gi,__data.EO.CategoryId);
        _str = _str.replace(/\$Tags/gi,__data.EO.Tags);
        if(__data.EO.IsSizable=="1"){
            _str = _str.replace(/\$IsSizable/gi,"是");
        }else{
            _str = _str.replace(/\$IsSizable/gi,"否");
        }
        if(__data.EO.IsColorable=="1"){
            _str = _str.replace(/\$IsColorable/gi,"是");
        }else{
            _str = _str.replace(/\$IsColorable/gi,"否");
        }
        //pic-----------------------------------------
        var _pic = new Array();
        _pic.push('<img id="'+__picId+'" ');
        if(__data.Pic!=null && __data.Pic.length>0){
            _pic.push(' src="'+__data.Pic[0].Path+'" ');
        }else{
            _pic.push(' src="/cellula_client/default/images/def_product_cover.png" ');
        }
        _pic.push(' alt="cover"  onload="jskitUtil.doc.resizeImageOnLoad(this,false)"  /> ');
        _str = _str.replace(/\$MainPic/gi,_pic.join(''));
        _pic = null;
        //album-----------------------------------------
        if(__data.Pic!=null && __data.Pic.length>0){
            var _album = new Array();
            _album.push('<div class="productinfo_nails_l">');
            for(var i=0;i<__data.Pic.length;i++){
                _album.push('<div idx="'+i+'" onclick="'+__hd+'.showPic(this,event)"');
                if(i==0){
                    _album.push('class="productinfo_nail_i_c"');
                }else{
                    _album.push('class="productinfo_nail_i"');
                }
                _album.push('><img src="'+__data.Pic[i].Nail+'"  onload="'+__hd+'.resetPic(this,event)"/>');
                _album.push('</div>');
            }
            _album.push('</div>');
            _str = _str.replace(/\$Thrumbnails/gi,_album.join(''));
            _album = null;
        }else{
            _str = _str.replace(/\$Thrumbnails/gi,'');
        }
        //Atl-------------------------------------------------
        if(__data.Atl!=null && __data.Atl.length>0){
            var _atl = new Array();
            _atl.push('<table class="productinfo_atl_table">');
            _atl.push('<tr>');
            for(var i=0;i<__data.Atl.length;i++){
                _atl.push('<th>'+__data.Atl[i].Name+'</th>');
            }
            _atl.push('</tr>');
            _atl.push('<tr>');
            for(var i=0;i<__data.Atl.length;i++){
                _atl.push('<td>'+__data.Atl[i].Value+'</td>');
            }
            _atl.push('</tr>');
            _atl.push('</table>');
            _str = _str.replace(/\$AtlView/gi,_atl.join(''));
            _atl = null;
        }else{
            _str = _str.replace(/\$AtlView/gi,'');
        }
        
        //market-------------------------------------------
        if(__data.Market!=null && __data.Market.length>0){
            var _market = new Array();
            var _mname = null;
            var _mkey = null;
            for(var i=0;i<__data.Market.length;i++){
                _mname = __data.Market[i].Name.replace(/,/gi,":");
                _mkey = __data.Market[i].Key;
                _market.push('<div><a href="Biz/Product/List.aspx?mid='+_mkey+'">'+_mname+'</a></div>');
            }
            _str = _str.replace(/\$Markets/gi,_market.join(''));
            _market = null;
        }else{
            _str = _str.replace(/\$Markets/gi,'');
        }
        return _str;
    };
    
    this.setData = function(v){
        __data = v;
    };
    
    this.resetPic = function(sender,e){
        var w = sender.offsetWidth;
        var h = sender.offsetHeight;
        var ow = sender.parentNode.offsetWidth-4;
        var oh = sender.parentNode.offsetHeight-4;
        if(w>h){
            sender.style.width = (ow>w)?w:ow;
        }else{
            sender.style.height = (oh>h)?h:oh;
        }
        sender.style.display = "block";
    };
    this.showPic = function(sender,e){
        var idx = parseInt(sender.getAttribute("idx"));
        $("#"+__picId).src = __data.Pic[idx].Path;
        var nl = sender.parentNode.childNodes;
        for(var i=0;i<nl.length;i++){
            nl[i].className = "productinfo_nail_i";
        }
        sender.className = "productinfo_nail_i_c";
        nl = idx = null;
    };
    this.deploy = function(rBoxId,rTemplateKey){
        __box = $("#"+rBoxId);
        __templateKey = rTemplateKey;
        __loadTemplate();
    };
};